<!--  气泡提示窗 -->
<template>
    <div class="toast" v-if="toastData.status">{{ toastData.mess }}</div>
</template>

<script>
    export default {
        name: 'toast',
        props: {
            toastData: {
                type: Object,
                default: function () {
                    return {
                        status: false,
                        mess: '操作成功'
                    }
                }
            }
        }
    }
</script>

<style scoped lang="stylus">
    .toast
        position: absolute
        top: 50%
        left: 50% 
        min-width: 340px
        height: 60px
        line-height: 60px
        -webkit-border-radius: 4px
        -moz-border-radius: 4px
        border-radius: 4px
        background-color: rgba(0, 0, 0, .15)
        color: #fff
        font-size: 12px
        text-align: center
        -webkit-transform: translate(-50%, -50%)
        -moz-transform: translate(-50%, -50%)
        -ms-transform: translate(-50%, -50%)
        -o-transform: translate(-50%, -50%)
        transform: translate(-50%, -50%)
        z-index :10000
</style>